<template>
<div>

<el-row>
  <el-col :span="20">
	<el-form ref="device" :rules="rules" 
		:model="device" 
		label-width="180px"
		>
		<el-form-item label="设备编号：" prop="code" >
			<el-input placeholder="请输入设备编号" v-model="deviceCode">
		    	<template slot="prepend">{{beforeDeviceCode}}</template>
		    </el-input>
		</el-form-item>

		<el-form-item label="设备密码：" >
			<el-input v-model="device.pas" placeholder="请输入设备密码" ></el-input>
		</el-form-item>

		<el-form-item class="mt10">
		     <el-button type="primary" 
		     @click="saveDevice(device, 'device')">
		     确认设备修改</el-button>
		</el-form-item>

	</el-form>	
  </el-col>
  <el-col :span="4"><div class="grid-content bg-purple-light"></div></el-col>
</el-row>
	


</div>		
</template>

<script>

import { mapGetters } from 'vuex'

export default {
	name: 'device',
		data () {
		return {
		  	
		  	rules: {
	          	code: [
	            	{ required: true, message: '请输入设备编号', trigger: 'blur' },
	            	//{ type: 'number', message: '请输入数字' },
	          	],
	        },
		}
	},

	props: {
		deviceData : {
			type : Object,
			// default : () => {
			// 	return {
			// 		code : '',
			// 		pas : '',
			// 	}
			// }
		},

		placeCode : String,
	},

	components: {
		
	},

	computed : {
		...mapGetters([
			'userInfo',
		]),


		device () {
			return this.deviceData;
		},


		deviceCode : {
			get () {
				var area = this.userInfo.company_sys_area;
				var index = this.device.code.indexOf(this.beforeDeviceCode);
				var result = this.device.code;
				if(index == 0){
					result = this.device.code.substring(this.beforeDeviceCode.length);
				}
				return result;
			},

			set (newValue) {
				this.device.code = this.beforeDeviceCode + newValue;
			},
			
		},

		beforeDeviceCode () {
			var companyCode = this.userInfo.company_code;
			var area = this.userInfo.company_sys_area;
			var arr = companyCode.split(area);
			return arr[1];
		}
	},

	methods : {
		saveDevice (item, formName) {
			this.$refs[formName].validate((valid) => {
		        if (valid) {
		            var para = {
						code : this.beforeDeviceCode + this.deviceCode, 
						pas : item.pas, 
						view : this.placeCode, 
						cb : () => {
							this.$emit('save-success');
						},
						err : (res) => {
							this.$notify.error({
					          title: '错误',
					          message: res,
					        });
						}
					};

					if(this.device.id) {
						para['id'] = this.device.id;
					}

					console.log(para);

					this.$store.dispatch('updateDevice', para);
		        } else {
		            console.log('error submit!!');
		            return false;
		        }
	        });
		}
	},

	watch : {
	    
	},

	mounted () {
		
		
	},

}
</script>

<style scoped>

</style>
